<template>
    <div class="main">
        <el-dialog :visible.sync="status" title="采购变更明细" @closed="close">
        <el-table  border :data="list" tooltip-effect="dark" v-loading="loading" element-loading-text="拼命加载中"
            element-loading-spinner="el-icon-loading" class="table" maxHeight="80vh" style="width: 100%;"
            :headerCellStyle="{
            'textAlign': 'center',
            'background': '#ff6a00',
            'color': 'white',
            'fontSize': '12px'
        }" :cellStyle="{
            'textAlign': 'center',
            'fontSize': '12px'
        }">
            <el-table-column label="名称" prop="materialName" min-width="100px"></el-table-column>
            <el-table-column label="编码" prop="materialId" min-width="100px"></el-table-column>
            <el-table-column label="数量" prop="count" min-width="100px"></el-table-column>
        </el-table>
        </el-dialog>
    </div>
</template>
<script>
import Decimal from 'decimal.js';
export default {
    props: {
        apiName: {
            type: String,
            default: ''
        },
        targetId: {
            type: String,
            default: ''
        },

    },
    mounted() {
        this.getData();
    },
    data() {
        return {
            pageSize: 10000000,
            pageNumber: 1,
            list: [],
            loading: false,
            status:true,
        }
    },
    methods: {
        close(){
            this.$emit('close',false)
        },
        getData() {
            let params = {
                pagesize: this.pageSize,
                pageNumber: this.pageNumber,
                targetId: this.targetId,

            }
            this.$api[this.apiName](params).then(res => {
                this.loading = true;
                if (res.length > 0) {
                    this.list = res;   
                }
                this.loading = false;

            })
        }
    }
}
</script>

<style lang="less" scoped>
.table /deep/ .el-table__footer-wrapper .el-table__footer .el-table__cell {
    text-align: center;
    font-size: 12px;
    font-weight: 400;
    color: #ff6a00;
}

.main /deep/ .el-loading-text {
    color: #ff6a00 !important;
}

.main /deep/ .el-icon-loading {
    color: #ff6a00 !important;
}
</style>